<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 箭头函数
        //1 调用语法
        // const fn = () => {

        // }

        // 定义函数
        // const add_fn = (x, y) => {
        //     return x + y
        // }

        // 调用函数
        // const result = add_fn(1, 1)
        // console.log(result)

        //2 特性
        //2.1 当参数只有一个时，可以省略小括号
        // 输入一个参数，并在控制台进行打印
        // const fn = arg => {
        //     console.log(arg)
        // }

        // fn("测试打印功能")

        //2.2 当函数体只有一句话时，可以省略大括号，此时箭头函数自带return功能
        // 实现两数相加功能
        // const add = (x, y) => x + y
        
        // const result = add(2, 3)
        // console.log(result)

        //2.3 当直接返回一个对象时，为了简写，需要给对象添加一对小括号
        // 定义函数，直接返回一个对象
        // const fn = () => ({
        //     status: 200,
        //     data: {
        //         username: "careathers",
        //         address: "China"
        //     },
        //     message: "Succeed!"
        // })

        // const result = fn()
        // console.log(result)

        //3 应用：作为回调函数进行使用
        // setTimeout(() => {
        //     console.log("回调函数！")
        // }, 2000)

        // 练习：将arr数组中大于30的数留下
        // const arr = [11, 22, 33, 44]

        // const filter_arr = arr.filter(item => item > 30)
        // console.log(filter_arr)

        // const objArray = arr.map((item, index) => ({
        //     index,
        //     "values": item
        // }))
        // console.log(objArray)

        // const obj = {
        //     name: "xiaoming"
        // }

        // const {name: newName} = obj
        // console.log(newName)
        // 上述两个不是相同的概念，一个是对象构造是缩写，一个是解构赋值，就按照正常逻辑理解即可

        // 练习：检查一个数组中的元素是否都是奇数
        // const arr = [11, 22, 33, 44]

        // const answer = arr.every((item) => item % 2 === 1)

        // 检查arr数组中的所有元素是否都大于10
        // const answer = arr.every((item) => item > 10)
        // console.log(answer)
        // ---------------------------------------------------------

        // 数组重要方法汇总讲解
        //1 在数组中新增元素
        // const arr = [11, 22, 33]

        // //<1> 尾增元素 44 
        // const ret = arr.push(44)
        
        // console.log(`返回值:${ret}`)
        // console.log(arr)

        //头插
        // const arr = [11, 22, 33]

        // // 头插元素 44
        // const ret = arr.unshift(44)

        // console.log(`返回值：${ret}`)
        // console.log(arr)

        //2 在数组中删除元素
        // 尾删
        // const arr = [11, 22, 33, 44]

        // // 删除数组中最后一个元素
        // const ret = arr.pop()

        // console.log(`返回值：${ret}`)
        // console.log(arr)

        // 头删
        // const arr = [11, 22, 33, 44]

        // // 删除数组第一个元素
        // const ret = arr.shift()
        
        // console.log(`返回值：${ret}`)
        // console.log(arr)

        // 3 在数组的任意位置进行增删操作
        // const arr = [11, 22, 33, 44]

        // // 任务1：在1下标新增 999
        // const ret = arr.splice(1, 0, 999)

        // console.log(`返回值：${ret}`)
        // console.log(arr)
        
        // const arr = [11, 22, 33, 44]

        // // 任务2：删除22， 33
        // const ret = arr.splice(1, 2)

        // console.log(`返回值：${ret}`)
        // console.log(arr)

        // 4 数组遍历
        // const arr = [11, 22, 33, 44]
        
        // // 使用for循环进行遍历数组
        // for(let i = 0; i < arr.length; i++) {
        //     console.log(arr[i])
        // }

        // arr.forEach((item, index, array) => {
        //     console.log(item, index, array)
        // })

        // 5 数组筛选元素

        // const arr = [11, 22, 33, 44]

        // // 筛选出数组中的所有偶数
        // filteredArray = arr.filter((item) => item % 2 === 0)

        // console.log(filteredArray)

        // 6 数组映射方法
        // const arr = [11, 22, 33, 44]

        // // 对数组中每个元素进行倍增操作
        // const newArray = arr.map((item) => item * 2)

        // console.log(newArray)

        // 7 检测每一个
        // const arr = [11, 22, 33, 44]

        // // 判断数组中的元素值是否全部大于10
        // const result = arr.every((item) => item > 10)

        // console.log(result)
        
        // 8 汇总函数
        // const goodsList = [
        //     {id: 1, name: "篮球", num: 1},
        //     {id: 2, name: "玩具", num: 3},
        //     {id: 3, name: "书籍", num: 2}
        // ]
        // // 求总数量
        // const sum = goodsList.reduce((prev, current) => prev + current["num"], 0)

        // console.log(sum)
        
        // 普通的求和实现
        // const arr = [11, 22, 33, 44, 55]

        // // 求和
        // const sum = arr.reduce((prev, current) => prev + current, 0)

        // console.log(sum)

        //-----------------------------------------------------------------
        // 对象重要方法
        // const obj = {
        //     status: 200,
        //     info: {
        //         useName: "careathers",
        //         age: 18,
        //         address: "China"
        //     },
        //     message: "OK"
        // }

        // 既然有Object.Keys()方法，那么一定会有Object.Values()方法，自己试一试

        // Object.Keys()：用于获取对象的所有键
        // const keyList = Object.keys(obj)

        // console.log(keyList)
        
        // Object.values()：用于获取对象的所有值
        // const valueList = Object.values(obj)

        // console.log(valueList)

        // 示例
        // const obj = {
        //     id: 100001,
        //     name: "Bit",
        //     age: 9,
        //     address: "湖南省长沙市雨花区香樟路22号"
        // }

        // // 需求：只遍历obj中以字母a开头的属性
        // const keyList = Object.keys(obj).filter((item) => item[0] === "a")
        // .forEach((key) => console.log(obj[key]))

        // console.log(keyList)

        // 复制对象
        // const obj = {
        //     id: 100001,
        //     name: "Bit",
        //     age: 9,
        //     address: "湖南省长沙市雨花区香樟路22号"
        // }
        // const obj1 = {...obj}
        // console.log(obj1)

        // // 复制数组
        // const arr = [11, 22, 33, 44]
        // const arr1 = [...arr]
        // console.log(arr1)

        // 合并数组
        const arr1 = [11, 22, 33]
        const arr2 = [44, 55, 66]

        const arr = [...arr1, ...arr2]
        console.log(arr)

        // 合并对象
        const obj1 = {
            name: "careathers",
            age: 18
        }
        const obj2 = {
            height: 181,
            age: 19
        }

        const obj = {
            ...obj1,
            ...obj2
        }
        console.log(obj)

    </script>
</body>
</html>